{% extends 'base_backend.html' %}
{% load static admin_static i18n %}
{% load config_filters %}

{% block header_tail %}
    <link rel="stylesheet" href="{% static 'public/CodeMirror/lib/codemirror.css' %}">
    <link rel="stylesheet" href="{% static 'public/ComboSelect/css/combo.select.css' %}">
    <link rel="stylesheet" href="{% static 'public/CodeMirror/theme/lesser-dark.css' %}">
    <link rel="stylesheet" href="{% static 'zhongbao/config/css/main.css' %}">
{% endblock header_tail %}

{% block section_content %}
    <div>
        <div class="box-header with-border">
            <h3 class="box-title">审核配置</h3>
        </div>
        <!-- form start -->
        <div class="box box-primary">
            <div class="box-body">
                <!-- /.box-header -->
                {#                    <div class="box-header">#}
                {#                        <button class="btn btn-primary" id="_save">修改配置</button>#}
                {#                        <button type="submit" class="btn btn-primary" id="_submit" name="_save"#}
                {#                                style="display: none">sure#}
                {#                        </button>#}
                {#                    </div>#}
                <div>
                    <div class="box" style="float: left; width: 65%; margin-right: 1%">
                        <div class="box-body no-padding" style="width: 100%">
                            <table class="table table-bordered" style="float: left; width:47% ">
                                <tbody>
                                <tr><td>配置ID</td><td>{{ config.id }}</td></tr>
                                <tr><td>配置名称</td><td>{{ config.savename }}</td></tr>
                                <tr><td>网站域名</td><td>{{ config.url }}</td></tr>
                                <tr><td>上传人</td><td>{{ config.author }}</td></tr>
                                <tr><td>上传时间</td><td>{{ savetime }}</td></tr>
                                </tbody>
                            </table>
                            <p style="float: left; margin-left: 10px"></p>
                            <table class="table table-bordered" style="float: left; width:47% ">
                                <tbody>
                                    <tr><td>所属分组</td><td>{{ config.gid|config_foreign_object:'gid' }}</td></tr>
                                    <tr><td>数据类型</td><td>{{ config.webtype|config_foreign_object:'webtype' }}</td></tr>
                                    <tr><td>行业类型</td><td>{{ config.tid|config_foreign_object:'tid' }}</td></tr>
                                    <tr><td>标签</td><td>{{ config.tags }}</td></tr>
                                    <tr><td>频道</td><td><p class="btn btn-xs btn-primary" id="config-channel" style="">查看频道</p></td></tr>
                                <tr></tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="box" style="float: left;width: 34%">
                     <div class="input-group" style="width: 100%;margin-bottom: 5px">
                        <h5 style="float: left">总分：{{ check_score }}</h5><h5 style="float: left; margin-left: 30px">已审核次数：{{ check_num }}</h5>
                        <h5><a href="{% url 'config:check_history' config_id %}" class="btn-link" style="margin-left: 10px"
                       target="_blank">审核历史</a></h5>
                    </div>
                        <form action="{% url 'config:check_config' config.id %}" method="post">{% csrf_token %}
                            <div style="width: 100%">
                                {% for field in form %}
                                    <div class="input-group" style="width: 100%;">
                                        <label for="" class="" style="float: left">{{ field.label }}：</label>
                                        <p style="float: left; width: 60%;">{{ field }}</p>
                                    </div>
                                {% endfor %}
                            </div>
                            <button type="submit" class="btn btn-primary btn-sm" id="check-sub" style="float: right">
                                提交审核
                            </button>
                        </form>
                    </div>
                </div>
                <br style="clear: both">
                <hr style="margin-top: 0">
                <div class="form-group">
                    <a href="{% url 'config:change_history' config_id %}" class="btn btn-info btn-xs"
                       target="_blank">修改历史</a>
                </div>

                <div class="form-group">
                    <div id="file_show">
                        <textarea name="code" id="code" cols="100%" rows="30">{{ code }}</textarea>
                    </div>
                </div>
                <br>

                <!--确认修改弹出框-->
                <div class="modal fade" id="cancel-window" tabindex="-1" role="dialog"
                     aria-labelledby="myModalLabel" style="top:30%">
                    <div class="modal-dialog" role="document">
                        <div class="panel panel-danger">
                            <div class="panel-heading">
                                <h3 class="panel-title">确认要修改配置吗？</h3>
                            </div>
                            <div class="modal-footer">
                                <button type="button" id="cancel_close" class="btn btn-default"
                                        data-dismiss="modal">取消
                                </button>
                                <button type="submit" id="cancel-submit" class="btn btn-default">
                                    确定
                                </button>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 频道编辑弹出窗口-->
                <div class="modal fade" id="config-channel-editor" tabindex="-1" role="dialog"
                     aria-labelledby="myModalLabel">
                    <div class="modal-dialog modal-lg" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"
                                        id="close-button0"><span
                                        aria-hidden="true">×</span></button>
                                <h4 class="modal-title" id="myModalLabel">频道</h4>
                            </div>
                            <div class="modal-body">
                                <table class="table table-bordered table-striped">
                                    <tbody id="channel-tbody">
                                    {% for channel in channels_org %}
                                        <tr class="channel-tr" id="{{ channel.id }}">
                                            <td class="channel-url"><span>{{ channel.channelurl }}</span>
                                                <input type="text" class="no-display"
                                                       value="{{ channel.channelurl }}" style="width: 100%"
                                                       name="channel-url-{{ channel.id }}"></td>
                                            <td class="channel-name"><span>{{ channel.channelname }}</span>
                                                <input type="text" class="no-display"
                                                       value="{{ channel.channelname }}"
                                                       name="channel-name-{{ channel.id }}">
                                            </td>
                                        </tr>
                                    {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                            <div class="modal-footer">
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
{% endblock section_content %}

{% block body_js %}
    {{ block.super }}
    <script src="{% static 'public/CodeMirror/lib/codemirror.js' %}"></script>
    <script src="{% static 'public/CodeMirror/mode/python/python.js' %}"></script>
    <script src="{% static 'public/ComboSelect/js/jquery.combo.select.js' %}"></script>
    <script src="{% static 'zhongbao/config/js/select_pulic.js' %}"></script>
    <script>
        var body = $('body');
        body.append("<div id='DiffBox'></div>");
        var DiffBox = $('#DiffBox');
        body.append("<div id='mask'></div>");

        $(document).ready(function () {
            $.ajaxSetup({
                data: {csrfmiddlewaretoken: '{{ csrf_token }}'}
            });
            var change_tag = 0;
            var change_config_message = $('input[name="change_config_message"]');

            var file_show = $('#file_show');
            var textarea = document.getElementById('code');
            var editor = CodeMirror.fromTextArea(textarea, {
                mode: "python",
                lineNumbers: true,
                theme: "lesser-dark",
                readOnly: true
            });
            editor.setOption("extraKeys", {
                Tab: function (cm) {
                    var spaces = new Array(cm.getOption("indentUnit") + 1).join(" ");
                    cm.replaceSelection(spaces);
                }
            });
            $('#_save').click(function () {
                if (change_config_message.val().length == 0) {
                    alert('修改信息为空，请确认您进行了修改，并填写修改信息。');
                    return false;
                } else {
                    textarea.innerHTML = editor.getValue();
                    $('#cancel-window').modal();
                }
            });

            $('.chang_config_tr').hover(function () {
                    var note = $(this).find('.change_diff_a');
                    note.removeClass('no-display');
                }, function () {
                    var note = $(this).parent().find('.change_diff_a');
                    note.addClass('no-display');
                }
            );

            // 频道弹出框
            var config_channel = $('#config-channel');
            var channel_edtitor = $('#config-channel-editor');
            var channels = $("#channel-config-content");
            config_channel.click(function () {
                channel_edtitor.modal()
            });
        });

    </script>

{% endblock body_js %}